<template>
	<view>
		<view>
			<u-empty :show="showEmpty" mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png">
			</u-empty>
			<view class="uni-flex-center" v-for="(item, index) in list">
				<view class="main-service uni-cell-90" style="padding-bottom: 10rpx; width: 96%; margin-left: 2%;">
					<view class="user-list">
						<view class="title u-rela">
							<view class="u-abso pos_left">
								<view v-if="item.complete==1 && item.status==1"><text class="dis_inl_blo circle"></text>设备情况：<text style="color:#18B566;">正常</text></view>
								<view v-else-if="item.complete==1 && item.status==-1"><text class="dis_inl_blo circle circle1"></text>设备情况：<text style="color:#ff0000;">异常</text></view>
								<view v-else ><text class="dis_inl_blo circle circle2"></text>设备情况：<text style="color:#ff5500;">待巡查</text></view>
							</view>
							<view class="u-abso pos_right">
								<text v-if="item.complete==1" style="color:#0B868E;">已巡更</text>
								<text v-else style="color:#0B868E;">未巡更</text>
							</view>
						</view>
						<!-- <u-line></u-line> -->
						<view class="u-padding-20">
							<view class="d_view u-margin-bottom-20">
								<text class="l_title">设备名称</text>
								<text class="d_content">{{item.name}}</text>
							</view>
							<view v-if="item.address" class="d_view u-margin-bottom-20">
								<text class="l_title">设备位置</text>
								<text class="d_content">{{item.address}}</text>
							</view>
							
							<view class="d_view u-margin-bottom-20">
								<text class="l_title">设备巡期</text>
								<text class="d_content" v-if="item.type==0">日巡</text>
								<text class="d_content" v-if="item.type==1">周巡</text>
								<text class="d_content" v-if="item.type==2">月巡</text>
								<text class="d_content" v-if="item.type==3">年巡</text>
							</view>
							<view class="d_view u-margin-bottom-20">
								<text class="l_title">巡查次数</text>
								<text class="d_content"><text style="color:#0B868E;">{{item.num}}</text>/{{item.total}}</text>
							</view>
							<view class="d_view" v-if="item.num!=0">
								<text class="l_title">最近巡查时间</text>
								<text class="d_content">{{item.time}}</text>
							</view>
						</view>
						<view class="u-padding-15 u-border-top u-text-right">
							<u-button class="u-margin-right-20" type="primary" shape="circle" size="mini" @click="patrolDetail(item.code)">查看详情</u-button>
						</view>
						<view style="clear: both;"></view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getPatrolList,
		getPatrolStatusList
	} from "@/service/patrolService.js";
	export default {
		data () {
			return {
				list: [],
				status:0,
				status_label:'',
				showEmpty: false,
			}
		},
		onLoad(options) {
			this.status=options.status;
			let status=options.status;
			if(status==99 || status==1 || status== 0){
				getPatrolList({
					complete: status
				}).then(this.getPatrolList);
				
			}else if(status==2){
				getPatrolStatusList({
					status: 1
				}).then(this.getPatrolStatusList);
			}else if(status==-1){
				getPatrolStatusList({
					status: status
				}).then(this.getPatrolStatusList);
			}
			
		},
		
		methods:{
			getPatrolList(e) {
				if (e.code == 200) {
					this.list=e.result;
					this.showEmpty=false
				}else{
					this.showEmpty=true;
					this.list=[]
				}
			},
			getPatrolStatusList(e) {
				if (e.code == 200) {
					this.showEmpty=false
					this.list=e.result;
				}else{
					this.showEmpty=true;
					this.list=[]
				}
			},
			patrolDetail:function(code){
				uni.navigateTo({
					url:'./patrolDetail?code='+code
				})
			}
		}
	}
</script>

<style lang="scss">
	.u-empty.data-v-3d842a77 {
		margin-top:120rpx !important;
	}
	page{
		background-color: #F2F2F2;
	}
	.circle{
		width:15rpx;
		height:15rpx;
		margin-right:15rpx;
		text-align: center;
		border-radius: 50%;
		background-color: #18B566;
	}
	.circle1{
		background-color:#ff0000 ;
	}
	.circle2{
		background-color:#ff5500 ;
	}
	.l_title {
		color: #999;
		float: left;
	}
	
	.d_content {
		color: #666;
	}
	
	.d_view {
		font-size: 28rpx;
		color: #999;
		/* margin-top: 30rpx; */
		text-align: right;
	}
	.main-service {
		margin-top: 20upx;
		border-radius: 10upx;
		background: #ffffff;
		box-shadow: 5rpx 5rpx 20rpx rgba(0, 0, 0, 0.15);
	}
	
	.main-service .title {
		height:70rpx;
		line-height: 70rpx;
		font-size: 28rpx;
	}
</style>
